import * as YvanUI from 'yvan-ui-wotu'

interface Ref {
    t1: YvanUI.Text,
    t2: YvanUI.Text
    roleTree: YvanUI.Tree
}

const React = YvanUI.React
const {Card} = YvanUI.Antd
const Observer = YvanUI.Observer
const _ = YvanUI.lodash

export default class SimpleTabs extends YvanUI.Scope<void, Ref> {

    main = this.$$({
        t1: '',
        t2: ''
    })

    otherState = this.$$({
        bindSelected: ['FZT'],
        bindChecked: null
    })

    treeData: any[] = []
    checkable: boolean = true

    onRender() {
        window['biz'] = this

        setTimeout(()=>{
            const treeData = [
                {
                    title: '0-0',
                    key: '0-0',
                    children: [
                        {
                            title: '0-0-0',
                            key: '0-0-0',
                            children: [
                                { title: '0-0-0-0', key: '0-0-0-0' },
                                { title: '0-0-0-1', key: '0-0-0-1' },
                                { title: '0-0-0-2', key: '0-0-0-2' },
                            ],
                        },
                        {
                            title: '0-0-1',
                            key: '0-0-1',
                            children: [
                                { title: '0-0-1-0', key: '0-0-1-0' },
                                { title: '0-0-1-1', key: '0-0-1-1' },
                                { title: '0-0-1-2', key: '0-0-1-2' },
                            ],
                        },
                        {
                            title: '0-0-2',
                            key: '0-0-2',
                        },
                    ],
                },
                {
                    title: '0-1',
                    key: '0-1',
                    children: [
                        { title: '0-1-0-0', key: '0-1-0-0' },
                        { title: '0-1-0-1', key: '0-1-0-1' },
                        { title: '0-1-0-2', key: '0-1-0-2' },
                    ],
                },
                {
                    title: '0-2',
                    key: '0-2',
                },
            ];
            const data2 = [
                {
                    FBRANCHORGNAME: "AAA集团",
                    FBRANCHORGCODE: "FJT",
                    FPARENTID: "AAA",
                },
                {
                    FBRANCHORGNAME: "重庆AAA有限公司",
                    FBRANCHORGCODE: "FDM",
                    FPARENTID: "FJT",
                    disabled: true
                },
                {
                    FBRANCHORGNAME: "湖北AAA有限公司",
                    FBRANCHORGCODE: "FXA",
                    FPARENTID: "FJT",
                },
                {
                    FBRANCHORGNAME: "武汉AAA有限公司",
                    FBRANCHORGCODE: "FZT",
                    FPARENTID: "FXA",
                    disabled: true
                },
                {
                    FBRANCHORGNAME: "宜昌AAA有限公司",
                    FBRANCHORGCODE: "FYC",
                    FPARENTID: "FXA",
                }
            ]
            this.treeData = data2
            this.refs.roleTree.refresh()
        }, 500)
    }

    vjson = {
        title: '极简-Tabs',
        items: [
            {
                view:'card',
                items:[
                    {
                        view: 'button',
                        text: "测试",
                        onClick: ()=>{
                            console.log("测试一下")
                            console.log("select:", this.otherState.bindSelected)
                            console.log("check:", this.otherState.bindChecked)
                            this.checkable = !this.checkable
                        }
                    },
                    {
                        view: 'tabs',
                        defaultTabIndex: 0,
                        items: [
                            {
                                title: '选项卡1',
                                content: {
                                    view: 'tree',
                                    ref: 'roleTree',
                                    checkable: this.checkable,
                                    defaultExpandAll: true,
                                    searchable: true,
                                    bindChecked: 'otherState.bindChecked',
                                    bindSelected: 'otherState.bindSelected',
                                    // checkStrictly: true,
                                    displayField: "FBRANCHORGNAME",
                                    valueField: "FBRANCHORGCODE",
                                    parentField: "FPARENTID",
                                    // treeData: this.treeData,
                                    dataSource: () => this.treeData
                                }
                            },
                            {
                                title: '选项卡2',
                                content: {
                                    view: 'card',
                                    title: '卡片2'
                                }
                            }
                        ]
                    }
                ]
            }
        ]
    }
}